<template>
  <div>
    <el-form ref="tableSearchParam" :model="tableSearchParam" :inline="true">
      <lemon-e-form :form-attr="tableSearchFormParam.formAttr" :cols="tableSearchFormParam.cols"></lemon-e-form>
      <el-row>
        <el-col :span="10">&nbsp;</el-col>
        <el-col :span="4">
          <el-form-item>
            <el-button type="primary" @click="searchTableData" icon="el-icon-search" size="small">查询
            </el-button>
            <el-button @click="clearSearchForm" icon="el-icon-refresh" size="small">重置
            </el-button>
          </el-form-item>
        </el-col>
        <el-col :span="10">&nbsp;</el-col>
      </el-row>
    </el-form>
  </div>
</template>

<style lang="scss">

</style>

<script>

  import LemonEForm from '../LemonEForm'

  export default {
    name: 'TableSearchForm',
    components: {LemonEForm},
    props: {
      /*
      tableSearchFormParam:{formAttr:{},cols:''}
      */
      tableSearchFormParam: Object
    },
    data() {
      return {
        tableSearchParam: {}
      }
    },
    created() {

    },
    methods: {
      initTableSearchParam() {
        for (const sc of this.tableSearchFormParam.formAttr.items) {
          this.$set(this.tableSearchParam, sc.code, sc.value)
        }
        console.log(this.tableSearchParam)
      },
      searchTableData() {
        this.initTableSearchParam()
        this.$emit('searchTableData', this.tableSearchParam)
      },
      clearSearchForm() {
        for (const sc of this.tableSearchFormParam.formAttr.items) {
          sc.value = ''
        }
      }
    }

  }
</script>
